<template>
	<view>
		<view style="height: 20rpx;"></view>
		
		<block v-if="list.length > 0">
			<block v-for="(item,index) in list" :key="index">
				<view class="list-public" @click="getSel(item)">
					<view class="display-a margin-bottom_10rpx">
						<image class="matrix-15" :src="isSel.indexOf(item.id) != -1 ? matrix16 : matrix15"></image>
						<image v-if="item.avatar" class="head" :src="item.avatar"></image>
						<image v-else class="head" :src="severAvatar"></image>
						<view style="width: 384rpx;">
							<view class="font-size_30rpx margin-bottom_10rpx">{{item.nickname}}</view>
							<view class="color_999999 font-size_24rpx">到期时间:{{date(item.create_time,item.expires_in)}}</view>
						</view>
						<block v-if="item.status == 2" class="empower" style="background: #F00;">已失效</block>
						<view v-else class="empower" :style="isEmpower(item) ? '' : 'background: #F00;'">
							{{isEmpower(item) ? '授权中' : '已失效'}}</view>
					</view>
				</view>
			</block>
		</block>
		<mescroll-empty v-else></mescroll-empty>
		
		<view style="height: 250rpx;"></view>
		
		<view class="list-bott">
			<view class="display-a margin-bottom_30rpx">
				<image class="matrix-15" @click="getAllSel()" :src="allSel ?matrix16 : matrix15"></image>
				<view class="color_00FFCA" @click="getAllSel()">全选({{isSel.length+'/'+total}})</view>
			</view>
			<view class="bott-but" @click="getBack()">确认</view>
		</view>
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				matrix16:this.$imgs.matrix16,
				matrix15:this.$imgs.matrix15,
				
			
				severAvatar:this.$imgs.severAvatar,
				list: [],
				
				obj: {
					groupId: '',
					groupName: '',
					selLabel: '',  //1。D音 2。K手 3。视频号 4.小红薯 5.B站    //1抖音h5发布 3矩阵首页待用户发布查询 4矩阵首页快手发布
				},
				
				isSel: [],
				allSel: false,
				groupArr: [], //选中的账户数据
				
				groupList: [],
				
				total: 0, //总条数
				selLabel:''
			}
		},
		
		computed: {
		
			// 是否已授权
			isEmpower() {
				return function(row) { //使用函数返回
					let isEmpower = false;
					// true,已授权 ,为false，则为已失效
					// row.type  1D音2K手
					isEmpower = this.selLabel == 7 ? new Date(this.msToDate(new Date()).hasTime.replace(/-/g,
						"\/")) < new Date(row.expirationDate) : (Math.floor(Math.floor(Date.now() / 1000)) < row
						.expires_in)
					return isEmpower;
				}
			},
		},
		
		onLoad(options) {
			
			this.obj = JSON.parse(decodeURIComponent(options.obj));  
			if (this.obj.selLabel) {
				this.isSel = [];
				this.groupArr = this.obj.groupArr;
				for (let i = 0 ; i < this.groupArr.length ; i++) {
					this.isSel.push(this.groupArr[i].id);
				}
				this.getAccountPageList();
			}
			
		},
		
		onShow() {
			
		},
		
		methods: {
			
			getBack () {
				
				if (this.isSel.length == 0) {
					this.$sun.toast("请先选择账户", 'none');
					return;
				}
				// this.groupArr=this.groupArr.map((item)=>{
				// 	return {
				// 		avatar:item.avatar,
				// 		create_time:item.create_time,
				// 		expires_in:item.expires_in,
				// 		group_id:item.group_id,
				// 		group_name:item.group_name,
				// 		id:item.id,
				// 		nickname:item.nickname
				// 	}
				// })
				var pages = getCurrentPages();
				var prevPage = pages[pages.length - 2]; //上一个页面
				prevPage.$vm.otherFun(JSON.stringify(this.groupArr));//重点$vm
				uni.navigateBack();
			},
			
			//全选
			getAllSel() {
				
				this.allSel = !this.allSel;
				
				this.isSel = [];
				this.groupArr = [];
				
				if (this.allSel) {
					for(let i = 0 ; i < this.list.length ; i++) {
						if (this.isEmpower(this.list[i])) {
							this.isSel.push(this.list[i].id);
							this.groupArr.push(this.list[i]);
						}
						if (this.list.length != this.groupArr.length) {
							this.$sun.toast("已失效账户无法选中",'none');
						}
					}
					
				}
				
			},
			
			//选中
			getSel(obj) {
				
				if (obj.status == 2) {
					this.$sun.toast("账户已失效!",'error');
					return;
				}
				
				if (!this.isEmpower(obj)) {
					this.$sun.toast("账户已失效!",'error');
					return;
				}
				
				
				let isBoo = this.isSel.indexOf(obj.id);
				if (isBoo == -1) {
					this.isSel.push(obj.id);
					this.groupArr.push(obj);
					if (Number(this.total == this.isSel.length)) {
						this.allSel = true;
					}
				}else {
					this.isSel.splice(isBoo,1);
					this.groupArr.splice(isBoo,1);
					this.allSel = false;
				}
			},
			
			async getAccountPageList() {
				const result = await this.$http.post({
					url: this.$api.userList,
					data: {
						
						uid: uni.getStorageSync("uid"),
						group_id: this.obj.groupId,
						
					}
				});
				if (result.errno == 0) {
					this.total = result.data.length;
					this.list = result.data;
					if (Number(this.total == this.isSel.length)) {
						this.allSel = true;
					}
				}
			},
			
			// date:创建日期 time：授权过期时间（需加）
			date(date, addTime) {
				console.log(date, addTime)
				// 日期或中国标准时间转毫秒数：
				let result = new Date(addTime * 1000);
				let allDate = null;
				if (this.selLabel == 5) {
					allDate = result + addTime;
				} else {
					allDate = result; // 按秒计算，所以需要*1000（原始毫秒）
				}
				// 预计到期时间计算
				let endtime = this.msToDate(allDate).hasTime
				// 去除秒数截取最后：的前面数字
				let index = endtime.lastIndexOf(":")
				endtime = endtime.substring(0, index);
				return endtime
			},
			// 毫秒数或中国标准时间转日期
			msToDate(msec) {
				let datetime = new Date(msec);
				let year = datetime.getFullYear();
				let month = datetime.getMonth();
				let date = datetime.getDate();
				let hour = datetime.getHours();
				let minute = datetime.getMinutes();
				let second = datetime.getSeconds();
				let result1 = year +
					'-' +
					((month + 1) >= 10 ? (month + 1) : '0' + (month + 1)) +
					'-' +
					((date + 1) < 10 ? '0' + date : date) +
					' ' +
					((hour + 1) < 10 ? '0' + hour : hour) +
					':' +
					((minute + 1) < 10 ? '0' + minute : minute) +
					':' +
					((second + 1) < 10 ? '0' + second : second);
			
				let result2 = year +
					'-' +
					((month + 1) >= 10 ? (month + 1) : '0' + (month + 1)) +
					'-' +
					((date + 1) < 10 ? '0' + date : date);
			
				let result = {
					hasTime: result1,
					withoutTime: result2
				};
			
				return result;
			},
			
		}
	}
</script>

<style lang="scss">
	
	.list-public {
		background-color: #fff;
		color: #FFF;
	}
	
	.bott-but {
		width: 690rpx;
		padding: 30rpx;
	
		
		background: linear-gradient(82.59deg, rgb(100, 117, 255) 0.187%,rgb(116, 100, 255) 99.863%);
		border-radius: 100rpx;
		color: #fff;
		font-size: 32rpx;
		text-align: center;
	}
	
	.list-bott {
		position: fixed;
		bottom: 0;
		width: 750rpx;
		// background-color: #FFFFFF;
		padding: 30rpx 30rpx 40rpx;
		z-index: 9;
	}
	
	.matrix-15 {
		width: 36rpx;
		height: 36rpx;
		margin-right: 20rpx;
	}
	
	.color_1E6CEB {
		color: #1E6CEB;
	}
	
	.empower {
		background: rgb(0, 134, 255);
		width: 96rpx;
		text-align: center;
		border-radius: 10rpx;
		padding: 8rpx;
		font-size: 24rpx;
		color: #FFFFFF;
		margin-left: auto;
	}
	
	.head {
		width: 80rpx;
		height: 80rpx;
		border-radius: 50%;
		margin-right: 20rpx;
	}
	
	page {
		width: 100%;
		overflow-x: hidden;
		border-top: none;
		background-color: #f4f4f4;
	}
	
</style>
